<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<title>Python Pokemon!</title>
	<link rel="stylesheet" type="text/css" href="/css/style.css" />
	<script src="/js/jquery.js" type="text/javascript"></script>
	<script type='text/javascript'>
		update_rate=5000
		debug=true
		live_obj_constructs={}
		live_obj_updates={}
		live_obj_updates['array']=function (stream)
		{
			$.ajax({url:'/data/'+stream.attr('id'),success:function(live_dat){
				jQuery.each(live_dat,function(index,obj){
					if(index>=stream.data('items').length)
					{
						console.log("New object: \t"+obj)
						stream.prepend((new live_obj_constructs[stream.attr('sub-type')](obj)).jqobj)
						stream.data('items').push(obj)
					}
				})
			}})
			console.log("Updated array-stream \""+stream.attr('id')+"\"")
		}
		live_obj_constructs['array']=function(obj){
			obj.data({items:[]})
		}
		function update_live_data()
		{
			needs_update=[]
			for( var t in live_obj_updates) needs_update.push(t)
			$(".live").each(function(){
				if(needs_update.indexOf($(this).attr('ltype'))>=0)
					live_obj_updates[$(this).attr('ltype')]($(this))
			})
			setTimeout(arguments.callee,update_rate);
		}
		$(document).ready(function(){
			needs_construct=[]
			for(var t in live_obj_constructs) needs_construct.push(t)
			$(".live").each(function(){
				if(needs_construct.indexOf($(this).attr('ltype'))>=0)
					live_obj_constructs[$(this).attr('ltype')]($(this))
			})
			update_live_data();
			active_type=(typeof initial_type != 'undefined')?initial_type:null;
			active_id=(typeof initial_id != 'undefined')?initial_id:null;
			if( active_type)
			{
				console.log("Start off the type of \""+active_type+"\"")
				if( active_id)
				{
					console.log("And the ID of \""+active_id+"\"")
				}
			}
		});
	</script>
</head>
<body>
	%#This stuff will ( eventually )
	%#Auto-navigate to viewing /data/type
	%#Or /data/type/id
	%if type:
	<script type="text/javascript">
		initial_type="{{type}}"
	</script>
	%end
	%if id:
	<script type="text/javascript">
		initial_id="{{id}}"
	</script>
	%end
	<script type="text/javascript">
		active_object=null;
		function set_active_object(type,id)
		{
			active_object=(new live_obj_constructs['static-dict']([type,id])).jqobj
			$("#posts > *").fadeOut("slow",function(){
				$("#posts").empty().prepend(active_object)
			})
			console.log("Active object changed.")
		}
	</script>
	<div class='header-section'><div class='wrapper'></div></div>

	<div style="height:100%;position:relative;z-index:2;"><div class='wrapper' id='content'>

	<div class='navbar' id='links-secion'>&nbsp;</div>

	<div style="padding:0 0 0 1em;">
		<h1 id='website-name'>WEBSITENAME</h1>
		<h2 id='website-subt'>Subtitle...</h2>
	</div>

	<div class="content-area"><!-- content area -->

	<div id="posts">
	<script type="text/javascript">
	live_obj_constructs['static-dict']=function(branches){
		url=''
		for( var b in branches)
		{
			if(url)url+='/'+b
		}
		console.log("Constructing static-dict:\t"+url)
		jqobj=$("<div/>").addClass('widget').addClass('live').data({items:{},my_url:url})
		jqobj.append($("<div/>").attr('id','meta').append($("<h1/>").text("DUR")))
		jqobj.append($("<div/>").text("HUR"))
		this.jqobj=jqobj
		return this
	}
	live_obj_updates['static-dict']=function(obj)
	{
		console.log("UPDATE STATIC DICT")
	}
	</script>
	</div>

	<div id="sidebar"><!-- [sidebar] -->
		<div class='widget' w-name='View Data'>
			<ul class='live' sub-type='d-type-keyname' ltype='array' id='data-types'>&nbsp;</ul>
			<script type="text/javascript">
				open_objs=[]
				live_obj_constructs['d-type-keyname']=function(OBJ){
					jqobj=$("<li/>")
					jqobj.text(OBJ).fadeIn('slow').addClass('live')
					jqobj.click(function(){
						if(open_objs.indexOf($(this).text())<0)
						{
							new_menu_obj=$("<span/>").addClass('widget').text($(this).text())
							new_menu_obj.click(function(){
								my_id=open_objs.indexOf($(this).text())
								if(my_id>=0)
								{
									open_objs.splice(my_id,1)
									$(this).remove()
								}
							})
							new_menu_obj.hover(function(){
								console.log("Hovering over this will hopefully change the active page later.")
								set_active_object($(this).text(),null)
							})
							$(".navbar").append(new_menu_obj)
							open_objs.push($(this).text())
						}
					});
					active_page=jqobj.attr('id')
					this.jqobj=jqobj
					return this
				}
			</script>
		</div>
	</div><!-- [/sidebar] -->

	<div style="clear:both;width:100%;height:0;min-height:0;">&nbsp;</div>
	</div><!-- [/content area] -->

	</div></div>
</body>
</html>